<!--
+----------------------------------------------------------------------
| 友得云客  - 开启房产营销新纪元
+----------------------------------------------------------------------
| Copyright (c) 2019~2023 优得（西安）信息科技有限公司版权所有
+----------------------------------------------------------------------
| Licensed 友得云客不是自由软件 未经允许不可移除相关版权
+----------------------------------------------------------------------
| Author: www.youdeyunke.com
+----------------------------------------------------------------------
-->
<template>
    <div v-if="module">
        <el-tabs :stretch="true">
            <el-tab-pane label="基础">

                <el-form-item label="视频文件">
                    <image-picker file-type="video" width="300" height="300" v-model="module.data.url"></image-picker>
                    <el-link style="margin-top: 8px" type="danger" @click="() => (module.data.url = '')"
                        v-if="module.data.url">删除</el-link>
                </el-form-item>

                <el-form-item label="封面配图">
                    <image-picker width="300" height="300" v-model="module.data.poster"></image-picker>
                    <el-link style="margin-top: 8px" type="danger" @click="() => (module.data.poster = '')"
                        v-if="module.data.poster">删除</el-link>
                </el-form-item>

                <el-form-item label="标题">
                    <el-switch v-model="module.data.title" />
                    <div style="font-size:12px;color:#999;">全屏播放时显示此标题</div>
                </el-form-item>

                <el-form-item label="自动播放">
                    <el-switch v-model="module.data.autoplay" />
                </el-form-item>

                <el-form-item label="静音播放">
                    <el-switch v-model="module.data.muted" />
                </el-form-item>

                <el-form-item label="循环播放">
                    <el-switch v-model="module.data.loop" />
                </el-form-item>

                <el-form-item label="显示控件">
                    <el-switch v-model="module.data.controls" />
                </el-form-item>

            </el-tab-pane>

            <el-tab-pane label="标题">
                <header-editor v-if="module.header" :module="module.header"></header-editor>
            </el-tab-pane>

            <el-tab-pane label="样式">
                <module-style-editor :module="module"></module-style-editor>
            </el-tab-pane>

        </el-tabs>

    </div>
</template>

<script>
import ModuleStyleEditor from "../ModuleStyleEditor/Index";
import ImagePicker from "@/components/ImagePicker";
import HeaderEditor from "../base/HeaderEditor";
export default {
    components: { ModuleStyleEditor, ImagePicker, HeaderEditor, },
    data () {
        return {
            currentBlockId: null,
            loading: false,
        };
    },
    props: {
        module: { type: Object },
    },

    mounted: function () { },

    computed: {
        // blocks: {
        //     get () {
        //         return this.module.blocks || [];
        //     },
        //     set (val) {
        //         this.$set(this.module, "blocks", val);
        //     },
        // },
    },

    methods: {
        // removeBlock: function (index) {
        //     var blocks = this.blocks;
        //     blocks.splice(index, 1);
        //     this.blocks = blocks;
        // },
        // appendBlock: function () {
        //     // 添加热区
        //     var block = {
        //         width: 100,
        //         height: 100,
        //         left: 10,
        //         top: 10,
        //     };
        //     var n = this.blocks.length + 1;
        //     var name = "区域" + n;
        //     block.name = name;
        //     var blocks = this.blocks;
        //     blocks.push(block);
        // },
    },
};
</script>

<style scoped></style>
